<!--用户操作日志-->
<template>
  <DataTable url="jobs/list"  pageable>
    <template #search="table">
      <Input type="text" v-model="table.params.id" placeholder="任务"/>
    </template>
    <template #default="table">
      <Table :datas="table.data" :loading="table.loading" >
        <TableItem title="序号" prop="$serial" :width="50"></TableItem>
        <TableItem title="任务ID" prop="id"></TableItem>
        <TableItem title="任务名" prop="title"></TableItem>
        <TableItem title="时间表达式" prop="cron" width="100px"></TableItem>
        <TableItem title="下一次执行时间" prop="nextTime" :format="formatDate"></TableItem>
        <TableItem title="说明" prop="describe"></TableItem>
        <TableItem title="状态" width="50px">
          <template #default="{ data }">
            <Icon :type="data.enable?'icon-check':'icon-ban'" color="green" :size="20" />
          </template>
        </TableItem>
        <TableItem title="控制" width="280px">
          <template #default="{ data }">
            <LinkButtons limit="4">
              <Button @click="changeStatus(data)"><Icon :type="data.enable?'icon-ban':'icon-check'"/>{{data.enable?'禁用':'启用'}}</Button>
              <Poptip content="是否立即执行任务?" @confirm="runTask(data)">
                <Button><Icon type="icon-play" size="16"/>执行</Button>
              </Poptip>
              <Button @click="showDetail(data)"><Icon type="h-icon-edit" />编辑</Button>
              <Button @click="showLogs(data)"><Icon type="icon-align-justify"/>日志</Button>
            </LinkButtons>
          </template>
        </TableItem>
      </Table>
    </template>
  </DataTable>
  <Modal v-model="isShowLogs" title="执行记录" :closeOnMask="false" hasCloseIcon>
    <div class="list-page" style="width: 1000px;height: 500px">
      <div class="list">
        <Table :datas="logsTable.data" :loading="logsTable.loading">
          <TableItem title="序号" prop="$serial" :width="50"></TableItem>
          <TableItem title="执行时间" prop="executeTime" :width="160" :format="formatDate"></TableItem>
          <TableItem title="运行时长" prop="takeTime" unit="ms" :width="100"></TableItem>
          <TableItem title="状态" prop="status" :width="50"></TableItem>
          <TableItem title="用户" prop="userName" :width="100"></TableItem>
<!--          <TableItem title="执行时服务所在IP" prop="ip"></TableItem>-->
<!--          <TableItem title="执行时服务ID" prop="serverId"></TableItem>-->
          <TableItem title="错误信息" prop="errorInfo"></TableItem>
        </Table>
      </div>
      <div class="bar">
        <Pagination v-model="logsTable.pagination" align="right" @change="logsTable.load()"></Pagination>
      </div>
    </div>
  </Modal>
  <Modal v-model="showEdit"  title="任务详情" :closeOnMask="false" hasCloseIcon>
    <div style="width: 300px">
      <Form :model="jobDetail" :rules="{}" ref="form">
        <FormItem label="任务名" prop="title">
          <Input type="text" v-model="jobDetail.title"/>
        </FormItem>
        <FormItem label="表达式" prop="cron">
          <Input  v-model="jobDetail.cron"/>
        </FormItem>
        <FormItem label="说明" prop="describe">
          <Textarea  v-model="jobDetail.describe" />
        </FormItem>
      </Form>
    </div>
    <template #footer>
      <Button @click="showEdit=false">取消</Button>
      <Button :loading="jobLoading" color="primary" @click="submitDetail">确认</Button>
    </template>
  </Modal>
</template>
<script setup>
import {ajax, util} from 'framework'
import {message,loading} from 'heyui'
import {ref, reactive, onMounted} from 'vue'
import LinkButtons from "../coms/LinkButtons.vue";

const formatDate = util.format("yyyy-MM-dd HH:mm:ss")
// let table = ajax.createDs('jobs/list', true)
// table.load()

let logsTable = ajax.createDs('jobs/list_log',true)

const isShowLogs=ref(false)


function changeStatus(dt) {
  loading("变更状态...")
  ajax.post('jobs/enable',{id:dt.id,enable:!dt.enable}).then(r=>{
    dt.enable=!dt.enable
    message("已变更")
  }).finally(e=>{
    loading.close()
  })
}

function runTask(dt){
  loading("任务执行中...")
  ajax.post('jobs/run',{id:dt.id}).then(r=>{
    message("已执行")
  }).finally(e=>{
    loading.close()
  })
}

function showLogs(dt){
  logsTable.params.taskId=dt.id
  logsTable.load().then(r=>{
    isShowLogs.value=true
  })
}
//任务编辑
const showEdit=ref(false)
const jobDetail=ref({title:'',describe:'',cron:''})
const jobLoading=ref(false)
function showDetail(detail){
  jobDetail.value=detail
  showEdit.value=true
  jobLoading.value=false
}
function submitDetail(){
  jobLoading.value=true
  ajax.post("jobs/save", jobDetail.value).then(r => {
    showEdit.value=false
  }).finally(e => {
    jobLoading.value = false
  })
}
</script>
